* {
  margin: 0;
  padding: 0;
}
ul,
li {
  list-style: none;
}
.container {
  width: 100vw;
  height: 100vh;
  padding-top: 22.6667vmin;
}
.container > span {
  position: fixed;
  top: 45%;
  right: 0;
  display: block;
  width: 12vmin;
  height: 12vmin;
  border: 2px solid #999;
  border-radius: 50%;
  background-color: #fff;
  font-size: 6vmin;
  text-align: center;
  line-height: 12vmin;
  color: #666;
}
.header {
  position: fixed;
  top: 0;
  /* box-sizing: border-box; */
  width: 100vw;
  height: 22.6667vmin;
  background: linear-gradient(to right, #ffd165, #febf2f);
  padding-bottom: 2.6667vmin;
  overflow: hidden;
}
.header > div {
  margin: 0 2.6667vmin;
}
.header > div:nth-of-type(1) {
  display: flex;
  justify-content: space-between;
  margin-top: 3.0667vmin;
  margin-bottom: 3.4667vmin;
}
.header > div:nth-of-type(1) > div:nth-of-type(1) > span {
  font-size: 4vmin;
}
.header > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(2) {
  font-weight: bolder;
}
.header > div:nth-of-type(1) > div:nth-of-type(1) > span:nth-of-type(3) {
  font-size: 2vmin;
}
.header ul {
  display: flex;
  justify-content: space-between;
  overflow: hidden;
}
.header li {
  box-sizing: border-box;
}
.header li:nth-of-type(1) > span {
  display: flex;
  flex-direction: column;
  font-size: 2.1333vmin;
}
.header li:nth-of-type(3) > span {
  font-size: 5.3333vmin;
  margin-top: 0.6667vmin;
  margin-left: 4.8vmin;
}
.header li > span {
  font-weight: bolder;
  font-size: 6.6667vmin;
}
.header > div:nth-of-type(2) {
  box-sizing: border-box;
  background-color: #fff;
  height: 9.3333vmin;
  border-radius: 1vmin;
  padding: 0 2.6667vmin;
  vertical-align: middle;
}
.header input {
  height: 9.3333vmin;
  padding-left: 1.5vmin;
  border: none;
  outline: none;
}
.header input::placeholder,
.header > div:nth-of-type(2) > span {
  font-size: 2.8vmin;
  color: #999;
}
.Dumpling {
  width: 100vw;
  height: 28vw;
  box-sizing: border-box;
  background-color: #fff;
  text-align: center;
}
.Dumpling > img {
  width: 94.6667vw;
  height: 24vw;
  margin-top: 4vw;
}
.Carousel {
  width: 100vw;
}
.Carousel > img {
  width: 100vw;
}
.column {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
}
.column > div {
  width: 20vw;
  height: 21.0667vw;
  display: flex;
  flex-direction: column;
  justify-content: end;
  text-align: center;
  font-size: 3.2vw;
}
.column img {
  width: 12vw;
  margin-bottom: 2vw;
  align-self: center;
}
div.Cursor {
  display: flex;
  height: 0.8vw;
  padding-top: 3.2vw;
  justify-content: center;
  flex-direction: row;
}
div.Cursor > span {
  width: 4vw;
  height: 0.8vw;
  margin: 0 0.8vw;
  border-radius: 1vw;
  background-color: #e4e4e4;
  /* align-self: center; */
}
span.hover,
div.Cursor > span:hover {
  background-color: #ffd161;
}
.Discount {
  height: 78.8vw;
  display: flex;
  padding: 0 2.6667vw;
  flex-direction: column;
}
.Discount > span {
  box-sizing: border-box;
  height: 18.6667vw;
  font-size: 5vw;
  font-weight: bolder;
  padding: 10.6667vw 0 2.6667vw 0;
}
.Discount > div:nth-of-type(1) {
  display: flex;
  justify-content: space-between;
}
.Discount > div:nth-of-type(1) > img {
  width: 46.6667vw;
  height: 29.3333vw;
}
.Discount > div:nth-of-type(2) {
  display: flex;
  justify-content: space-between;
}
.Discount > div:nth-of-type(2) > img {
  margin-top: 1.3333vw;
  width: 22.6667vw;
  height: 29.3333vw;
}
.main {
  height: 88vw;
  padding: 0 2.6667vw 13.3333vmin 0;
  display: flex;
  flex-direction: column;
}
.main > div:nth-of-type(1) {
  padding: 10.6667vw 0 2.6667vw 0;
  position: relative;
}
.main > div:nth-of-type(1) > span:nth-of-type(1) {
  box-sizing: border-box;
  height: 18.6667vw;
  font-size: 5vw;
  font-weight: bolder;
}
.main > div:nth-of-type(1) > span:nth-of-type(2) {
  position: absolute;
  right: 0;
  bottom: 3.7333vw;
}
.main > div:nth-of-type(1) > span:nth-of-type(2),
.main > div:nth-of-type(1) > span:nth-of-type(2) > span,
.main > div:nth-of-type(2) > div > span,
.footer > div > span:nth-of-type(2) {
  font-size: 2.6667vw;
  color: #757575;
}
.main > div:nth-of-type(2) {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.main > div:nth-of-type(2) > div {
  width: 46vw;
  height: 28vw;
  margin-bottom: 5.3333vw;
  display: flex;
  flex-direction: column;
}
.footer {
  display: flex;
  justify-content: space-around;
  width: 100vw;
  height: 13.0667vmin;
  position: fixed;
  bottom: 0;
  background: linear-gradient(#f2efeb, #e5e0d2);
}
.footer > div {
  display: flex;
  flex-direction: column;
  text-align: center;
}
.footer > div > span:nth-of-type(1) {
  margin-top: 2vmin;
  font-size: 6.6667vmin;
  color: #757575;
}
div.hover > span:nth-of-type(1),
.footer > div:hover > span:nth-of-type(1) {
  color: #ffbf30;
}
div.hover > span:nth-of-type(2),
.footer > div:hover > span:nth-of-type(2) {
  color: #000;
}
